@model WalkingTec.Mvvm.Doc.ViewModels.StudentVms.StudentVm

<wt:fieldset field-set-style="Simple" title="Upload">
 </wt:fieldset>
   <p>The upload control is used for file upload. Common properties are:</p>
        <table lay-filter="parse-table-demo">
            <thead>
                <tr>
                    <th lay-data="{field:'username', width:200}">properties</th>
                    <th lay-data="{field:'joinTime', width:600}">description</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Id</td>
                    <td>Control ID, generated by default according to the bound field name</td>
                </tr>
                <tr>
                    <td>Field</td>
                    <td>Binding field, required</td>
                </tr>
                <tr>
                    <td>Disabled</td>
                    <td>Disabled,or not</td>
                </tr>
                <tr>
                    <td>Name</td>
                    <td>Control name, generated by default according to the bound field name</td>
                </tr>
                <tr>
                    <td>LabelText</td>
                    <td>Label content</td>
                </tr>
                <tr>
                    <td>LabelWidth</td>
                    <td>Label length, default= 80</td>
                </tr>
                <tr>
                    <td>HideLabel</td>
                    <td>Hide label,or not</td>
                </tr>
                <tr>
                    <td>FileSize</td>
                    <td>File size limit ,by KB</td>
                </tr>
                <tr>
                    <td>UploadType</td>
                    <td>File type restriction: allfiles, imagefile, zipfile, excelfile, wordfile, pdffile, textfile</td>
                </tr>
                <tr>
                    <td>ThumbWidth</td>
                    <td>If the file type is ImageFile, set the thumbnail width allows the framework to automatically reduce the size of the picture to the specified width before saving</td>
                </tr>
                <tr>
                    <td>ThumbHeight</td>
                    <td>If the file type is imagefile, specifying the thumbnail width allows the framework to automatically reduce the picture to the specified height before saving</td>
                </tr>
                <tr>
                    <td>ShowPreview</td>
                    <td>use thumbnail preview, or not; if the upload file category is ImageFile, default=true</td>
                </tr>
                <tr>
                    <td>PreviewWidth</td>
                    <td>If thumbnail preview is used, set thumbnail width, default : 64</td>
                </tr>
                <tr>
                    <td>PreviewHeight</td>
                    <td>If thumbnail preview is used, set thumbnail height, default:64</td>
                </tr>
                <tr>
                    <td>CustomType</td>
                    <td>If the common uploadtype is not supported, you can customize file type restrictions, such as rar</td>
                </tr>
                <tr>
                  <td>ShowProgress</td>
                    <td>Display progress bar when uploading, or not</td>
                </tr>
            </tbody>
        </table>
    <wt:quote>
        <p>The upload control is closely connected with the FileAttachment provided by the framework, directly binding an ID field pointing to the fileattachment, and the framework will automatically save and delete the attachment</p>
        <p>The SaveFileModecan be set in the appsetting file to setting the saving method of framework attachments. Currently, it supports DataBase, Local and DFS</p>
        <p>The following example shows the case: no effect after selecting the file, because this document project does not connect to the real database</p>
        <p>Notice how to write an attachment in the Model</p>
    </wt:quote>
        <wt:tab>
          <wt:tabheaders>
            <wt:tabheader title="Effect" />
            <wt:tabheader title="Code" />
            <wt:tabheader title="Model" />
          </wt:tabheaders>
            <wt:tabcontents>
                <wt:tabcontent>
                    <wt:form vm="@Model" style="max-width:600px;">
                        <wt:upload field="Entity.PhotoId" upload-type="ImageFile" />
                        <wt:row align="AlignEnum.Right">
                            <wt:submitbutton disabled="true" />
                            <wt:closebutton disabled="true" />
                        </wt:row>
                    </wt:form>
                </wt:tabcontent>
                <wt:tabcontent>
                    <wt:code>
&ltwt:form vm="@@Model" width="600"&gt
    &ltwt:upload field="Entity.PhotoId" upload-type="ImageFile"  /&gt
    &ltwt:row align="AlignEnum.Right"&gt
        &ltwt:submitbutton disabled="true" /&gt
        &ltwt:closebutton disabled="true" /&gt
    &lt/wt:row&gt
&lt/wt:form&gt

                    </wt:code>
                </wt:tabcontent>
                <wt:tabcontent>
                    <wt:code>
    public class Student : BasePoco
    {
        [Display(Name = "Account")]
        [Required()]
        [StringLength(50)]
        public string LoginName { get; set; }

        [Display(Name = "Password")]
        [Required()]
        [StringLength(32)]
        public string Password { get; set; }

        [Display(Name = "Name")]
        [Required()]
        [StringLength(50)]
        public string Name { get; set; }

        //Photo and PhotoId together define a foreign key
        [Display(Name = "Photo")]
        public Guid? PhotoId { get; set; }

        [Display(Name = "Photo")]
        public FileAttachment Photo { get; set; }

    }

                    </wt:code>
                </wt:tabcontent>
            </wt:tabcontents>
        </wt:tab>

    <script>
    layui.use('code',function(){layui.code({ about: false })})
        layui.table.init('parse-table-demo', {
        limit: 100, page: false
        });
    </script>
<script>
  $("#@Model.ViewDivId").parent().css("height", "auto");
</script>
